var P6 = function (game) {

  this.create = function () {
    ClosePage(game, '6_0', '6', '6_r', '6_w');

    function Page(game, cbg, mbg, rbg, wbg) {
      var flagAry = [0, 0, 0, 0];
      var bg = game.add.sprite(0, 0, mbg);

      bg.anchor.setTo(0, 0);

      var graphics = game.add.graphics(0, 0);

      drawGraphics();

      function drawGraphics() {
        graphics.clear();
        var cir;
        for (var i = 0; i < 4; i++) {
          if (flagAry[i] === 1) {
            graphics.lineStyle(15, 0xD7692A, 1);
          } else {
            graphics.lineStyle(15, 0xE3B083, 1);
          }
          if (i < 2) {
            cir = graphics.drawRoundedRect(570 + i * 359, 300, 340, 141, 25);
          } else {
            cir = graphics.drawRoundedRect(570 + (i - 2) * 359, 462, 340, 141, 29);
          }
          cir.data = i;
        }
      }

      game.add.sprite(570, 300, '6add');

      var group = game.add.group();
      var button;
      for (var i = 0; i < 4; i++) {
        if (i < 2) {
          button = game.add.button(566 + i * 360, 300, 'button', actionOnClick, this, 2, 1, 0);
        } else {
          button = game.add.button(566 + (i - 2) * 360, 460, 'button', actionOnClick, this, 2, 1, 0);
        }
        button.width = 345;
        button.height = 150;
        button.data = i;
        group.add(button);
      }

      function actionOnClick(arg) {
        graphics.getChildAt()
        flagAry.forEach(function (item, i) {
          if (i != arg.data) {
            flagAry[i] = 0;
          }
        })
        flagAry[arg.data] = flagAry[arg.data] === 0 ? 1 : 0;
        drawGraphics();
      }


      game.add.button(1100, 630, imgs['prev'], onPrev, this, 2, 1, 0);
      game.add.button(1250, 630, imgs['submit'], onSubmit, this, 2, 1, 0);

      function onPrev() {
        game.goState('back');
        group.destroy();
      }

      function onSubmit(arg) {
        if (flagAry.join('_') === '1_0_0_0') {
          RightPage(game, cbg, mbg, rbg, wbg);
        } else {
          WrongPage(game, cbg, mbg, rbg, wbg);
        }
        group.destroy();
      }
    }

    function ClosePage(game, cbg, mbg, rbg, wbg) {
      var container = game.add.sprite(0, 0, '');
      var close = game.add.button(0, 0, cbg, onClose, this, 2, 1, 0);
      container.addChild(close);

      function onClose() {
        container.destroy();
        Page(game, cbg, mbg, rbg, wbg);
      }
    }

      function WrongPage(game, cbg, mbg, rbg, wbg) {
          var container = game.add.sprite(0, 0, '');

          var bg = game.add.image(0, 0, wbg);
          container.addChild(bg);

          var next = game.add.button(1250, 630, imgs['retry'], onClick, this, 2, 1, 0);
          container.addChild(next);
          function onClick() {
              container.destroy();
              Page(game, cbg, mbg, rbg, wbg);
          }
      }

    function RightPage(game, cbg, mbg, rbg, wbg) {
      var container = game.add.sprite(0, 0, '');
      var bg = game.add.image(0, 0, rbg);
      container.addChild(bg);
      var next = game.add.button(1250, 630, imgs['next'], onClick, game, 2, 1, 0);
      container.addChild(next);

      function onClick() {
        game.goState('next');
      }
    }
  }


}





